*{
    margin: 0;
    padding: 0;
}
.heard {
    width: 100%;
    height: 1.25rem;
    background-color: #f6325c;
    position: fixed;
    left: 0;
    top: 0;
}
.heard button {
    width: 1rem;
    background:linear-gradient(#f2f2f2,#f3f3f3) ;
    color: #999999;
    border: 1px solid #f2f2f2;
    border-radius: 5px;
    outline: none;
}
.heard button:nth-child(1) {
    float: left;
    margin-left: 10px;
    font-size: 0.6rem;
    margin-top: 8px;
}
.heard button:nth-child(2) {
    float: right;
    margin-right: 10px;
    font-size: 0.6rem;
    margin-top: 8px;
}
.banner {
    overflow: hidden;
    margin: 0.3125rem 0;
    margin-top: 60px;
}
.banner img {
    width: 10rem;
    height: 5rem;
}
.content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 0.5rem;
    overflow: hidden;
}
.content div {
    width: 1.875rem;
    height: 2.5rem;
    margin-bottom: 20px;
}
.content div .min_box1,.content div .min_box2,.content div .min_box3,.content div .min_box4,.content div .min_box5,.content div .min_box6,.content div .min_box7,.content div .min_box8,.content div .min_box9,.content div .min_box10,.content div .min_box11,.content div .min_box12 {
    width: 1.875rem;
    height: 1.875rem;
    border-radius: 15px;
    margin-bottom: 0;
    /* background-color: red; */
    text-align: center;
    line-height: 1.875rem;
    font-size: 50px;
    color: #ffffff;
}
.content div .min_box1 {
    background-color: #b693ed;
}
.content div .min_box2 {
    background-color: #63c3fd;
}
.content div .min_box3 {
    background-color: #feaec9;
}
.content div .min_box4 {
    background-color: #6ee1bc;
}
.content div .min_box5 {
    background-color: #f6dd78;
}
.content div .min_box6 {
    background-color: #f7c485;
}
.content div .min_box7 {
    background-color: #fcb297;
}
.content div .min_box8 {
    background-color: #f39488;
}
.content div .min_box9 {
    background-color: #d0c6bd;
}
.content div .min_box10 {
    background-color: #ff97cc;
}
.content div .min_box11 {
    background-color: #75a2fd;
}
.content div .min_box12 {
    background-color: #be98ad;
}
.content div p{
    margin-top: 5px;
    font-size: 0.34375rem;
    text-align: center;
    color: #333333;
}
.line {
    border-top: 1px solid #dddddd;
    margin-top: 10px;
}
.bottom {
    width: 100%;
    height: 1.40625rem;
}
.bottom dl {
    font-size: 0.28125rem;
    text-align: center;
    margin-bottom: 50px;
}
.bottom dl dt {
    margin-top: 10px;
    margin-bottom: 5px;
}
.min_bottom {
    height: 1.15625rem;
    display: flex;
    justify-content: space-between;
    position: fixed;
    left: 0;
    bottom: 0;
}
.min_bottom div{
    width: 3.3125rem;
    background-color: #f6325c;
    margin-top: 10px;
    text-align: center;
    font-size: 0.28125rem;
    line-height: 0.9rem;
    color: #ffffff;
} 